#systems-page #container {
  height: 100%;
}
#systems-page #alpha {
  background: #fff;
  box-shadow: none;
  left: 0;
}
#systems-page #blank-slate {
  margin-top: -65px;
  margin-left: -215px;
  text-align: center;
  width: 430px;
  position: absolute;
  top: 50%;
  left: 50%;
}
#systems-page #blank-slate p {
  color: rgba(0, 0, 0, 0.3);
  font-size: 12pt;
  margin-bottom: 20px;
}
#systems-page #messages {
  list-style: none;
  width: 100%;
}
#systems-page #messages li {
  padding: 0 10px;
  position: relative;
}
#systems-page #messages li:first-child {
  padding-top: 10px;
}
#systems-page #messages li:hover > span .time {
  opacity: 0.3;
}
#systems-page #messages li pre,
#systems-page #messages li footer {
  font-family: Menlo, monospace;
  font-size: 11px;
  line-height: 1.3;
  word-wrap: break-word;
}
#systems-page #messages li footer {
  font-weight: bold;
}
#systems-page #message-form {
  height: 21px;
  line-height: 1;
  position: relative;
  width: 100%;
}
#systems-page #message-label {
  background: transparent;
  cursor: pointer;
  font-family: Menlo, monospace;
  font-size: 11px;
  padding: 0 2px 0 10px;
}
#systems-page #message-label::after {
  margin: 0;
  content: '$';
}
#systems-page #message-label:hover {
  text-decoration: underline;
}
#systems-page #message {
  box-shadow: none;
  display: inline-block;
  font-family: Menlo, monospace;
  font-size: 11px;
  margin: 0;
  padding: 0;
}
#systems-page #message:focus {
  box-shadow: none;
}
#systems-page #roster {
  background: rgba(60, 60, 60, 0.98);
  border: 2px solid rgb(12, 12, 12);
  border-radius: 3px;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.75);
  min-width: 250px;
  position: absolute;
  left: 10px;
}
#systems-page #roster-items {
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  overflow-y: auto;
  text-shadow: 0 1px 1px rgb(21, 21, 21);
}
#systems-page #roster-items li {
  border-top: 1px solid rgb(80, 80, 80);
  border-bottom: 1px solid rgb(48, 48, 48);
  line-height: 38px;
  list-style: none;
  padding-right: 50px;
  position: relative;
}
#systems-page #roster-items li.offline {
  color: #888;
}
#systems-page #roster-items li.offline .icon {
  opacity: 0.3;
}
#systems-page #roster-items li:hover:not(.group) {
  background: #319be7;
  background: -moz-linear-gradient(#319be7, #1b78d9);
  background: -ms-linear-gradient(#319be7, #1b78d9);
  background: -o-linear-gradient(#319be7, #1b78d9);
  background: -webkit-linear-gradient(#319be7, #1b78d9);
  border-top: 1px solid #148ddf;
  color: #fff;
  cursor: pointer;
  text-shadow: -1px 1px 1px hsl(210, 51%, 45%), 0px -1px 1px hsl(210, 51%, 49%);
}
#systems-page #roster-items li.group {
  background: #404040;
  background: -moz-linear-gradient(#404040, #353535);
  background: -ms-linear-gradient(#404040, #353535);
  background: -o-linear-gradient(#404040, #353535);
  background: -webkit-linear-gradient(#404040, #353535);
  color: #ccc;
  font-size: 10px;
  font-weight: bold;
  line-height: 2;
  padding-left: 10px;
  text-transform: uppercase;
}
#systems-page #roster-items li .icon {
  position: absolute;
  height: 32px;
  width: 32px;
  top: 2px;
}
#systems-page #roster-items li .icon svg {
  height: 32px;
  width: 32px;
}
#systems-page #roster-items li .text {
  padding-left: 32px;
}
#systems-page #roster-items li .unread {
  background: rgba(255, 255, 255, 0.15);
  border-radius: 30px;
  color: #fff;
  display: inline-block;
  font-size: 11px;
  font-weight: bold;
  line-height: 15px;
  padding: 0 6px;
  position: absolute;
  right: 10px;
  top: 12px;
}
#systems-page #roster-items li:hover .unread {
  color: #fff;
}
#systems-page #roster-form {
  background: rgb(80, 80, 80);
  background: -moz-linear-gradient(rgb(80,80,80), rgb(48, 48, 48));
  background: -ms-linear-gradient(rgb(80,80,80), rgb(48, 48, 48));
  background: -o-linear-gradient(rgb(80,80,80), rgb(48, 48, 48));
  background: -webkit-linear-gradient(rgb(80,80,80), rgb(48, 48, 48));
  padding: 3px 5px;
}
#systems-page #roster-form form {
  padding: 0;
  border: none;
}
#systems-page #roster-filter {
  width: 100%;
}
